<template>
  <div class="main">
    <el-tabs type="border-card">
      <el-tab-pane label="案件成本">
        <caseCost :caseId="caseId" />
      </el-tab-pane>
      <el-tab-pane label="出差记录">
        <caseTravel :caseId="caseId" />
      </el-tab-pane>
      <el-tab-pane label="报销记录">
        <caseExpense :caseId="caseId" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import caseCost from './components/caseCost.vue'
import caseTravel from './components/caseTravel.vue'
import caseExpense from './components/caseExpense.vue'
export default {
  components: { caseCost, caseTravel, caseExpense },
  data: function () {
    return {
      caseId: 0,
    }
  },
  methods: {},
  created: function () {
    this.caseId = this.$route.query.caseId
    if (!this.caseId) {
      return
    }
  },
}
</script>
<style scoped>
.main {
  height: 100%;
}
</style>
